<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
    <title>layout 后台管理</title>
    <link th:href="@{/layui/css/layui.css}" rel="stylesheet" />
</head>
<body class="layui-layout-body">
        <table id="log-table" lay-filter="test"></table>
</body>
<script th:src="@{/layui/layui.js}"></script>
<script th:src="@{/js/utils.js}"></script>
<script th:src="@{/js/token_filter.js}"></script>
<script th:ononline="none">

    layui.use('table', function() {
        let $ = layui.$;
        $(function(){
            let token = layui.data("tokens").token;
            ct();
            let table = layui.table;
            //第一个实例
            table.render({
                elem: '#log-table'
                ,method:"POST"
                ,url: 'localhost:2000/api/system/log/list' //数据接口
                ,page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                    layout: ['limit','limits', 'count', 'prev','page','next', 'first','last','skip'] //自定义分页布局
                    ,limit:20
                    ,limits:[5,10,15,20]
                    ,groups: 5 //只显示 5 个连续页码
                }
                ,request:{
                    pageName:"pageCurrent",
                    limitName:"pageSize"
                }
                ,contentType:"application/json;charset=UTF-8"
                ,response: {
                    statusCode: 200 //重新规定成功的状态码为 200，table 组件默认为 0
                }
                ,headers: {token:token}
                ,cols: [
                    [
                        {field: 'id', title: 'ID', sort: true, fixed: 'left'}
                        ,{field: 'description', title: '描述'}
                        ,{field: 'operatorName', title: '操作人名称',  sort: true}
                        ,{field: 'createTime', title: '操作时间'}
                        ,{field: 'operateAccount', title: '操作账号'}
                        ,{field: 'operatorRole', title: '操作人角色', sort: true}
                        ,{field: 'result', title: '结果', sort: true}
                    ]
                ]
                ,parseData:function(data){
                    return {
                        "code": data.code, //解析接口状态
                        "msg": data.msg, //解析提示文本
                        "count": data.data.total, //解析数据长度
                        "data": data.data.records //解析数据列表
                    };
                }
            });
        });
    });
</script>
</body>
</html>